import Square from "./square.js";
function Board(props) {
  const renderSquare = function(x, y) {
    return <Square key={y+"_"+x} x={x} y={y} onclick={()=>props.onclick(x,y)}
      value={props.squares[y][x]}
    />;
  }
  const renderS = function () {
    let yArr = []
    for (let y = 0; y < props.ySize; y++) {
      let xArr = []
      for (let x = 0; x < props.xSize; x++) {
        xArr.push(renderSquare(x, y))
      }
      yArr.push(
        <div className="board-row" key={y}>{xArr}</div>
      )
    }
    return yArr
  }
  return (
    <div>
      {renderS()}
    </div>
  );
}
export default Board